<template>
	<view class="content">
		<view class="list" v-if="list.length">
			<view class="item">
				<view class="title">
					<text>后台提现</text>
					<view class="state">
						提现成功
					</view>
				</view>
				<view class="con">
					<view class="left">
						<text>申请时间：2025-01-12 15:2</text>
						<text>申请时间：2025-01-12 15:2</text>
					</view>
					<view class="right">
						<text class="num">164.3</text>
						<text class="t">元</text>
					</view>
				</view>
			</view>
			<u-loadmore class="loadmore" :status="status" v-if="pageNum > 1" />
		</view>
		<view class="null" v-else>
			<u-empty text="暂无内容" icon="/static/e.png" marginTop="100" ></u-empty>
		</view> 
	</view>
</template>

<script>
	export default{
		data(){
			return{
				pageNum:1,
				status: 'loadmore', 
				allData: false,
				list:[]
			}
		},
		onLoad() {
			this.getList()
		},
		onReachBottom() {
			if (this.allData) {
				this.status = 'loading'
				this.pageNum++
				this.getList();
			}
		},
		methods:{
			getList(){
				this.$http({
					url:"/umsCashWithdrawal/paginQuery",
					method:"get",
					data:{
						pageSize:10,
						pageNum:this.pageNum
					}
				}).then(data=>{
					if (this.pageNum == 1) {
						this.list = data.list
					} else {
						this.list.push(...data.list) 
					}  
					if (data.totalPage > data.pageNum) {
						this.allData = true
						this.status = 'loading'
					} else {
						this.status = 'nomore' 
					    this.allData = false
					}
				})
			}
		}
	}
</script>

<style>
	page{
		background: #F8F8F8;
	}
</style>

<style lang="scss" scoped>
	.content{
		padding: 30rpx;
		box-sizing: border-box;
		.item{
			background: #fff;
			padding: 26rpx;
			box-sizing: border-box;
			.con{
				display: flex;
				align-items: flex-end;
				justify-content: space-between;
				.right{
					.num{
						font-size: 32rpx;
						color: #020202;
						font-family: 'DINPro-Medium';  
					}
					.t{
						font-size: 20rpx;
						color: #020202;
						margin-left: 5rpx;
					}
				}
				.left{
					text{
						display: block;
						font-size: 24rpx;
						color: #999999;
						line-height: 40rpx;
					}
				}
			}
			.title{
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-bottom: 20rpx;
				text{
					font-size: 28rpx;
					color: #020202;
					font-weight: bold;
				}
				.state{
					width: 108rpx;
					height: 40rpx;
					background: #F8F8F8;
					border-radius: 2rpx;
					text-align: center;
					line-height: 40rpx;
					font-size: 20rpx;
					color: #666666;
				}
			}
		}
	}
</style>